import React from 'react';
import BaseForm from '@/components/baseform';
import { Form, Button, message } from 'antd';
import { history } from 'umi'
import { connect } from 'dva';
import Footer from '../../layouts/footer';
import styles from './index.less';

const LoginPage = (props) => {
  const [form] = Form.useForm();
  const { dispatch } = props;

  const search = () => {
    Promise.all([form.validateFields()])
      .then((resList) => {
        const data = resList[0];

        dispatch({
          type: 'common/goLogin',
          payload: {
            username: data.username,
            password: data.password,
          }
        }).then((res) => {
          if(res.code == 200){
            message.success('登录成功！')
            history.push('/workplace')
            localStorage.setItem('token_umi_app', res.data.token)
            dispatch({
              type: 'common/getUserInfo',
            })
          }
        })
      
        // login({
        //     username: data.username,
        //     password: data.password,
        // }).then((res) => {
        //   if(res.code == 200){
        //     message.success('登录成功！')
        //     history.push('/index')
        //     localStorage.setItem('token_umi_app', res.data.token)
        //   }
        //   console.log(res, '--res');
        // });
      })
      .catch((err) => {});
  };
  const itemLayoutItem = {
    labelCol: { span: 4 },
    wrapperCol: { span: 18 },
  }
  return (
    <div className={styles.loginWrap}>
      <div className={styles.loginFormWrap}>
          <h1>Login</h1>
          <BaseForm
            search={search}
            form={form}
            formItemLayout={itemLayoutItem}
            formItems={[
              {
                label: '用户名',
                key: 'username',
                type: 'string',
                ruleList: [{ required: true, message: '用户名不能为空' }],
              },
              {
                label: '密码',
                key: 'password',
                type: 'password',
                ruleList: [{ required: true, message: '密码不能为空' }],
              },
            ]}
          />
          <div style={{display: 'flex',justifyContent: 'center'}}>
             <Button type='primary' onClick={search}>登录</Button>
          </div>
      </div>
      <Footer></Footer>
    </div>
  );
};


export default connect()(LoginPage);
